<template>
    <div class="userLog">
        <div class="list scrollber" v-infinite-scroll="load"
        infinite-scroll-delay="300"
        >
            <el-timeline :reverse="reverse" v-if="list.length > 0">
                <el-timeline-item
                v-for="(activity, index) in list"
                :key="index"
                :timestamp="dayjs(activity.createTime).format('YYYY/MM/DD HH:mm:ss')">
                {{ activity.logDescribe }} {{ activity.link }}
                </el-timeline-item>
            </el-timeline>
            <el-empty description="该用户没留下任何记录！" v-else></el-empty>
        </div>
        <div>

        </div>
    </div>
</template>

<script>
    import { getLog } from '@/api/user'
    export default {
        data(){
            return {
                limit : 20,
                page : 1,
                list : [],
                reverse : false
            }
        },
        created(){
            this.getList()
        },
        methods : {
            getList(){
                getLog({
                    limit : this.limit,
                    page : this.page,
                    uid : this.$route.query.uid,
                }).then(res => {
                    if(res.code == 200){
                        this.list.push(...res.data)
                    }
                })
            },
            load(){
                this.page++;
                this.getList()
            }
        }
    }
</script>

<style lang="less" scoped>
.userLog{
    display: flex;
    justify-content: center;
    padding: 50px 0;
    &>div{
        flex: 1;
        display: flex;
        justify-content: center;
    }
    .list{
        overflow-x: hidden;
        overflow-y: auto;
        height: 70vh;
    }
}
</style>